<template>
  <div class="equipmentAdmin_box" v-init-screen-h="0">
    <div class="flex-x flex-top h-full">
      <div class="left">
        <TreeBox
          :key="mixinBoderKey"
          ref="treeBox"
          :tree-data="deviceTreeData"
          :deviceToken="controlDeviceInfo.token"
          @treeCheck="treeCheck"
        />
      </div>

      <div class="content">
        <router-view :key="controlDeviceInfo.token"></router-view>
      </div>
    </div>
  </div>
</template>

<script>
let timer = null;
import TreeBox from "./components/TreeBox.vue";
import { mapGetters } from "vuex";

import { mixinOpenedKey } from "@/mixin/openedKey.js";
import {
  getAllParentNodes,
  DEVICE_TIME
} from "@/views/centralizedControl/js/utils";
import {
  VACUUM_FURNACE,
  CHEMICAL,
  ROUTINE,
  Z2_TOKEN,
  Z6_TOKEN,
  Z16_TOKEN,
  Z17_TOKEN,
  Z7_TOKEN,
  Z8_TOKEN,
  Z9_TOKEN,
  Z10_TOKEN,
  Z11_TOKEN,
  Z12_TOKEN,
  Z13_TOKEN,
  Z14_TOKEN,
  Z15_TOKEN,
  Z18_TOKEN,
  Z19_TOKEN,
  Z20_TOKEN,
  ROUTINE_CHEMICAL,
  P300_TOKEN,
  P800_TOKEN
} from "./constant";
import { get4hour } from "@/utils/currentDate";
export default {
  mixins: [mixinOpenedKey],
  components: {
    TreeBox
  },
  computed: {
    ...mapGetters([
      "deviceTreeData",
      "controlDeviceInfo",
      "deviceAttributesList",
      "deviceTempAreaCount"
    ]),
    // 设备toekn
    deviceToken() {
      return this.controlDeviceInfo.token;
    },
    // 分配token
    assignmentToken() {
      return this.controlDeviceInfo.assignmentToken;
    }
  },
  watch: {
    // 目前重复点击父路由,页面会被重置,这单独处理一下.
    async $route(to, from) {
      if (to.path == "/deviceOperation") {
        // 切换设备清空数据 取消订阅
        this.$store.commit("centralizedControl/endClent");
        this.$store.commit("centralizedControl/clearData");
        await this.$store.dispatch(
          "centralizedControl/getDevicesV2Tree",
          this.$route.params.token
        );

        this.navTo(this.deviceToken);
        this.init();
      }
    }
  },
  data() {
    return {
      loading: true
    };
  },
  async mounted() {
    // 切换设备清空数据 取消订阅
    this.$store.commit("centralizedControl/endClent");
    this.$store.commit("centralizedControl/clearData");
    await this.$store.dispatch(
      "centralizedControl/getDevicesV2Tree",
      this.$route.params.token
    );
    this.navTo(this.deviceToken);
    // this.navTo("13020102");
    this.init();
  },
  methods: {
    // 启动轮询
    initInterval() {
      if (timer) {
        clearInterval(timer);
        timer = null;
      }
      timer = setInterval(async () => {
        console.log("设备运行中心开启轮询");
        await this.$store.dispatch(
          "centralizedControl/getDevicesV2Tree",
          this.deviceToken
        );
        this.getTaskList();
      }, DEVICE_TIME);
      this.$once("hook:beforeDestroy", () => {
        console.log("设备运行中心关闭轮询", timer);
        if (timer) {
          clearInterval(timer);
          timer = null;
        }
      });
    },
    // 初始化右侧需要的数据 全部存入vuex中
    async init() {
      const tenantToken = this.$store.state.user.tenant.token;
      // 获取点位
      await this.$store.dispatch(
        "centralizedControl/getDeviceAttributes",
        {
          deviceToken: this.deviceToken,
          assignmentToken: this.assignmentToken,
          tenantToken,
          intervalTime: "1s",
          deviceEventType: "Measurement",
          endTime: this.$moment().format("YYYY-MM-DD HH:mm:ss"),
          startTime: get4hour()
          // startTime: "2023-01-10 10:10:00"
        }
        // "e7d543b9-0b26-469d-969b-dafc137c734f"
      );
      // 获取当前温区的数量
      await this.$store.dispatch(
        "centralizedControl/getTempAreaCount",
        {
          deviceToken: this.deviceToken,
          assignmentToken: this.assignmentToken,
          tenantToken,
          deviceEventType: "Measurement",
          type: "tempAreaCount"
        }
        // "e7d543b9-0b26-469d-969b-dafc137c734f"
      );

      // 三个区的数据
      // await this.$store.dispatch(
      //   "centralizedControl/getAssignmentsByToken3",
      //   this.assignmentToken
      //   // "e7d543b9-0b26-469d-969b-dafc137c734f"
      // );
      // // 三个区的历史曲线
      // await this.$store.dispatch(
      //   "centralizedControl/getAssignmentsByToken",
      //   {
      //     assignmentToken: this.assignmentToken,
      //     tenantToken,
      //     type: this.deviceAttributesList.map(item => item.token),
      //     intervalTime: "1m",
      //     deviceEventType: "Measurement",
      //     endTime: this.$moment().format("YYYY-MM-DD HH:mm:ss"),
      //     startTime: "2023-01-05 10:10:00"
      //   }
      //   // "e7d543b9-0b26-469d-969b-dafc137c734f"
      // );

      // 打开mqtt获取三个区的实时曲线
      // setTimeout(() => {
      this.$store.dispatch("centralizedControl/receiveData", {
        tenantToken,
        deviceToken: this.deviceToken,
        assignmentToken: this.assignmentToken
        // assignmentToken: "e7d543b9-0b26-469d-969b-dafc137c734f",
      });
      // }, 500);
      await this.getTaskList();
      // 启动轮询
      this.initInterval();
      this.loading = false;
    },
    async getTaskList() {
      return new Promise(async (reslove, reject) => {
        // 获取任务反馈 同步执行获取taskid在去拿曲线表格
        await this.$store.dispatch(
          "centralizedControl/getTaskFeedback",
          this.deviceToken
        );
        // 是否存在 任务id
        if (this.$store.getters["centralizedControl/getTaskId"]) {
          // 远程监控的曲线表格
          await this.$store.dispatch(
            "centralizedControl/getFormulaDownloadInfoList",
            this.$store.getters["centralizedControl/getTaskId"]
          );
        }
        reslove();
      });
    },
    navTo(token) {
      if (token == Z19_TOKEN) {
        this.$router.push({
          path: "/Z19",
          query: {
            token: token
          }
        });
        return;
      }
      if (token == Z20_TOKEN) {
        this.$router.push({
          path: "/Z20",
          query: {
            token: token
          }
        });
        return;
      }
      if (token == Z18_TOKEN) {
        this.$router.push({
          path: "/Z18",
          query: {
            token: token
          }
        });
        return;
      }
      if (token == Z15_TOKEN) {
        this.$router.push({
          path: "/Z15",
          query: {
            token: token
          }
        });
        return;
      }
      if (token == Z14_TOKEN) {
        this.$router.push({
          path: "/Z14",
          query: {
            token: token
          }
        });
        return;
      }
      if (token == Z13_TOKEN) {
        this.$router.push({
          path: "/Z13",
          query: {
            token: token
          }
        });
        return;
      }
      if (token == Z12_TOKEN) {
        this.$router.push({
          path: "/Z12",
          query: {
            token: token
          }
        });
        return;
      }
      if (token == Z10_TOKEN) {
        this.$router.push({
          path: "/Z10",
          query: {
            token: token
          }
        });
        return;
      }
      if (token == Z11_TOKEN) {
        this.$router.push({
          path: "/Z11",
          query: {
            token: token
          }
        });
        return;
      }
      if (token == Z9_TOKEN) {
        this.$router.push({
          path: "/Z9",
          query: {
            token: token
          }
        });
        return;
      }
      if (token == Z8_TOKEN) {
        this.$router.push({
          path: "/Z8",
          query: {
            token: token
          }
        });
        return;
      }
      if (token == Z7_TOKEN) {
        this.$router.push({
          path: "/Z7",
          query: {
            token: token
          }
        });
        return;
      }
      if (token == Z6_TOKEN) {
        this.$router.push({
          path: "/Z6",
          query: {
            token: token
          }
        });
        return;
      }
      if (token == Z17_TOKEN) {
        this.$router.push({
          path: "/Z17",
          query: {
            token: token
          }
        });
        return;
      }
      if (token == Z16_TOKEN) {
        this.$router.push({
          path: "/Z16",
          query: {
            token: token
          }
        });
        return;
      }
      if (token == Z2_TOKEN) {
        this.$router.push({
          path: "/Z2",
          query: {
            token: token
          }
        });
        return;
      }
      if (token == "13020102") {
        this.$router.push({
          path: "/Z21",
          query: {
            token: token
          }
        });
        return;
      }
      if (token == "P300") {
        this.$router.push({
          path: "/P300",
          query: {
            token: token
          }
        });
        return;
      }
      if (token == "P800") {
        this.$router.push({
          path: "/P800",
          query: {
            token: token
          }
        });
        return;
      }
      //  化学热处理
      if (CHEMICAL.includes(token)) {
        this.$router.push({
          path: "/chemical",
          query: {
            token: token
          }
        });
        return;
      }
      //  常规炉
      if (ROUTINE.includes(token)) {
        this.$router.push({
          path: "/chemical",
          query: {
            token: token
          }
        });
        return;
      }

      // 目前尚未开发的炉子
      this.$router.push({
        path: "/otherPage",
        query: {
          token: token
        }
      });
      //  真空炉 - 公共部分
      // if (VACUUM_FURNACE.includes(token)) {
      //   this.$router.push({
      //     path: "/vacuumFurnace"
      //   });
      //   return;
      // }
    },
    treeCheck(val, node) {
      // 切换设备清空数据 取消订阅
      this.$store.commit("centralizedControl/endClent");
      this.$store.commit("centralizedControl/clearData");
      const { parent } = node;
      const { token } = node.data;
      const parentNodes = getAllParentNodes(this.deviceTreeData, token);
      const names = parentNodes.map(item => item.name).reverse();
      // deviceParentName:names.join('/')
      this.$store.commit("centralizedControl/setDeviceInfo", {
        ...node.data,
        deviceParentName: names.join("/")
      });

      if (token == "P300") {
        this.$router.push({
          path: "/P300",
          query: {
            token: token
          }
        });
        return;
      }
      if (token == "P800") {
        this.$router.push({
          path: "/P800",
          query: {
            token: token
          }
        });
        return;
      }
      // 化学炉子和常规炉子 直接跳
      if (ROUTINE_CHEMICAL.includes(parent.data.token)) {
        this.$router.push({
          path: "/chemical",
          query: {
            token: token
          }
        });
      } else {
        // 根据不同的token跳转不同页面
        this.navTo(token);
      }
      this.init();
    }
  }
};
</script>

<style lang="scss" scoped>
.equipmentAdmin_box {
  background: url(../../../assets/images/applicationCenter/app_bg.jpg) no-repeat
    100%;
  background-size: cover;
  color: #fff;
  position: relative;
  width: 100%;
  height: 100%;

  .left {
    width: 16%;
    height: 100%;
  }

  .content {
    height: 100%;
    width: 84%;
  }

  // .content_bottom {
  // }
}
</style>
